﻿<!DOCTYPE html>
<html lang="en">
<head>
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>Tree Grid Example</title>

    <link href="../../sparkle_/css/sparkle_jquery_ui.css" rel="stylesheet" />
    <link href="../../sparkle_/css/sparkle.css" rel="stylesheet" />
    <style>
        .gridContainer {
            /*width: 400px;*/
            float: left;
            padding: 10px;
        }

        .grid {
            padding-top: 0px;
            padding-left: 0px;
            padding-right: 2px;
            padding-bottom: 2px;
            height: 300px;
        }

        .gridPager {
            padding: 0px;
        }

        .gridHeader {
            font-size: 14px;
            font-weight: bold;
            padding-bottom: 4px;
        }
    </style>

    <style>
    .cell-effort-driven {
      text-align: center;
    }

    .slick-group-title[level='0'] {
      font-weight: bold;
    }

    .slick-group-title[level='1'] {
      text-decoration: underline;
    }

    .slick-group-title[level='2'] {
      font-style: italic;
    }
  </style>
</head>
<body class="sparkle-xrm">

    <!-- TODO -->
    <div>
        <div class="grid-header" style="width: 100%">
            <label>Projects</label>
        </div>
        <div id="projectsGrid" style="width: 100%; height: 500px; overflow: hidden; outline: 0px; position: relative;">
        </div>

    </div>

    <!-- Start of Scripts-->
    <script src="../../ClientGlobalContext.js.aspx" type="text/javascript"></script>

    <!-- Sparkle Xrm -->
    <!--<script src="../../sparkle_/js/SparkleXrmUI_Dependancies.js"></script>-->
     <!-- Uncomment the following and comment about the script above to debug the individual dependancies-->
    
    <script src="../../sparkle_/dependancies/SparkleXrm-jquery.js" type="text/javascript"></script>
    <script src="../../sparkle_/dependancies/jquery.event.drag.js" type="text/javascript"></script>
    <script src="../../sparkle_/dependancies/blockUI.js" type="text/javascript"></script>
    <script src="../../sparkle_/dependancies/slick.core.js" type="text/javascript"></script>
    <script src="../../sparkle_/dependancies/slick.grid.js" type="text/javascript"></script>
    <script src="../../sparkle_/dependancies/slick.rowselectionmodel.js" type="text/javascript"></script>
    <script src="../../sparkle_/dependancies/slick.checkboxselectcolumn.js" type="text/javascript"></script>
    <script src="../../sparkle_/dependancies/slick.pager.js" type="text/javascript"></script>
    <script src="../../sparkle_/dependancies/slick.editors.js" type="text/javascript"></script>
    <script src="../../sparkle_/dependancies/knockout.debug.js" type="text/javascript"></script>
    <script src="../../sparkle_/dependancies/knockout.validation.debug.js" type="text/javascript"></script>
    <!-- End Dependancies-->

    <script src="../../sparkle_/js/mscorlib.js" type="text/javascript"></script>
    <script src="../../sparkle_/js/SparkleXrm.js" type="text/javascript"></script>
    <script src="../../sparkle_/js/SparkleXrmUI.js" type="text/javascript"></script>
    <script src="../../sparkle_/dependancies/slick.dataview.js"></script>
    <script src="../../sparkle_/dependancies/slick.groupitemmetadataprovider.js"></script>

    <!-- Client Code -->
    <script src="../js/Client.js"></script>
    <script type="text/javascript">
        Client.DataGrouping.Views.TreeView.init();
    </script>
</body>
</html>
